<template>
  <div id="HundredDay"></div>
</template>

<script>
import cookie from '../../cookien'

export default {
  name: 'HundredDay',
  data () {
    return {
      click: [],
      purchased: []
    }
  },
  mounted () {
    // 百天点击量
    this.hundredClick().then(data => {
      console.log(data)
      // 百天销售量
      this.getSalesNumber().then(value => {
        console.log(value)
        this.thisYearMsg(data, value)
      }).catch(err => {
        console.log(err)
      })
    }).catch(err => {
      console.log(err)
    })
  },
  methods: {
    thisYearMsg (click, purchased) {
      var myChart = this.$echarts.init(document.getElementById('HundredDay'))
      myChart.setOption({
        tooltip: {
          trigger: 'axis'
        },
        legend: {
          data: ['点击量', '销售量'],
          top: '0',
          left: 'center'
        },
        grid: {
          left: '3%',
          right: '4%',
          bottom: '3%',
          containLabel: true
        },
        toolbox: {
          feature: {
            saveAsImage: {}
          }
        },
        xAxis: {
          type: 'category',
          boundaryGap: false,
          data: ['10', '20', '30', '40', '50', '60', '70', '80', '90', '100/天']
        },
        yAxis: {
          type: 'value'
        },
        series: [
          {
            name: '点击量',
            type: 'line',
            // stack: 'Total',
            label: {
              show: true,
              position: 'top'
            },
            data: click
          },
          {
            name: '销售量',
            type: 'line',
            // stack: 'Total',
            label: {
              show: true,
              position: 'top'
            },
            data: purchased
          }
        ]
      })
    },
    // 近百天点击量
    hundredClick () {
      return new Promise((resolve, reject) => {
        this.$axios({
          url: '/Menu/Admin/getVisit',
          headers: {
            token: cookie.getToken()
          }
        }).then(data => {
          resolve(data.data.object)
        }).catch(err => {
          reject(err)
        })
      })
    },
    // 近百天销售量
    getSalesNumber () {
      return new Promise((resolve, reject) => {
        this.$axios({
          url: '/Menu/Admin/getSalesNumber',
          headers: {
            token: cookie.getToken()
          }
        }).then(data => {
          resolve(data.data.object)
        }).catch(err => {
          reject(err)
        })
      })
    }
  }
}
</script>

<style lang="less" scoped>
  #HundredDay{
    width: 100%;
    height: 620px;
  }
</style>
